<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文本样式</title>
    <style>
        div{
         
            border:1px red solid;
            width:800px;
            /*text-align文本的水平对齐 
            可选值：left左侧对齐 right右侧对齐 center居中对齐 justify两端对齐*/
            /* text-align: justify; */
            font-size: 50px;
        }
        span{
            font-size:20px;
            border:1px darkorchid solid;
            vertical-align:super;

            /*vertical-align设置元素的垂直对齐方式
            可选值：baseline默认值，基线对齐；top顶部对齐，子元素和父元素顶部对齐；
            bottom底部对齐；middle居中对齐*/
        }
        /*其他的文本样式
        1、text-decoration设置文本修饰 
        可选值：none什么都没有 underline下划线 line-through删除线 overline上划线
        2、white-space设置网页如何处理空白
        可选值：normal正常 nowrap不换行 pre保留空白
        3、overflow:ellipsis表示省略号*/
    </style>
</head>
<body>
    <div>
        hhh今天天气<span>要努力hiehei</span>
    </div>
    <!-- <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab atque hic quis excepturi quisquam maxime, sed asperiores, possimus aut a reiciendis non sint aliquid obcaecati, fuga tempora architecto quaerat nobis.</div> -->
    
</body>
</html>